<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>欢乐英语小测验</title>
	<link rel="stylesheet" href="__PUBLIC__/css/index.css">
</head>
<body>
<div class="container" s_id="{$s_info.student_id}" s_name="{$s_info.s_name}">
	<div class="top-bar">
		<img src="__PUBLIC__/images/timg.jpg" alt="">
	</div>
	<div class="middle-box">
		<h1>英语词量测试 
			<!-- <a href="{:U('Student/index')}" class="restart">重新开始</a> -->
			<div class="end-time-bar">倒计时:<i id="time"></i></div>
		</h1>
		<!-- <div class="ques-wrap">
			<div class="tip">单选题</div>
			<div class="title">
				<span>1</span>/
				<span>50</span>
				<span>Do you love English？</span>
			</div>
			<div class="options">
				<div class="option"><span>A：Very much!</span></div>
				<div class="option"><span>B：A little</span></div>
				<div class="option"><span>C：Just so so</span></div>
				<div class="option"><span>D：Learn it for fun..</span></div>
			</div> -->
			<!-- <div class="you-ans">
				<span class="wrong">您答错了！标准答案是:A</span>
				<span class="right">太棒啦！标准答案是:B</span>
			</div> -->
			<!-- <div class="btns-wrap">
				<a href="javascript:;" class="btn">下一题</a>
			</div>
		</div> -->
	</div>
</div>
<script src="__PUBLIC__/js/jquery-1.11.1.min.js"></script>
<script>
var indexPage= {
	op: {
		num: 1
	},
	init: function(){
		this.getData(this.op.num,false);
		this.endTime(300);
	},
	getData: function(num,isRight){
		var _num = this.op.num;
		$.ajax({
			type: "post",
			url: "{:U('Question/getQues')}",
			data: {
				num: num,
				isRight: isRight,
				s_id: $(".container").attr('s_id'),
				q_id: $('.title').attr('q_id')
			},
			success: function(data){
				console.log(data);
				data = JSON.parse(data);
				if(data.info =="success"){
					window.location.href="{:U('Result/index',array('s_id'=>$s_id))}";
					
					
				}else{

				var str = "";
				str +='<div class="ques-wrap">'
						+'<div class="tip">单选题</div>'
						+'<div class="title" ans='+data.que_ans+' q_id='+data.q_id+'>'
							+'<span>'+_num+'</span>/'
							+'<span style="margin-right:20px">50</span>'
							+'<span>'+data.que_title+'</span>'
						+'</div>'
						+'<div class="options">'
							+'<div class="option"><span>A：'+data.op1+'</span></div>'
							+'<div class="option"><span>B：'+data.op2+'</span></div>'
							+'<div class="option"><span>C：'+data.op3+'</span></div>'
							+'<div class="option"><span>D：'+data.op4+'</span></div>'
						+'</div>'
						+'<div class="btns-wrap">'
							+'<a href="javascript:;" class="btn">下一题</a>'
						+'</div>'
					+'</div>';
				$('.middle-box').find('.ques-wrap').remove().end().append(str);
				}
			}

		});
	},
	events: function(){
		var _ans = 0,
			_this = this;
		//单选择题
		$('.container').delegate(".option","click",function(){
			$(this).toggleClass("active").siblings().removeClass("active");
			_ans = $(".option").index($(this))+1;
		});

		$('body').delegate('.btn',"click",function(){
			if($(".active").size() ==0){
				alert("请选择一个答案！");
				return false;
			}
			var _realAns = $('.title').attr('ans');
			_this.op.num++;
			_this.getData(_this.op.num,(_realAns ==_ans));
		});
	},
	endTime: function(num){
		var _start = num;

		var _t = setInterval(function(){
			if(_start>0){
				_start--;
				$("#time").text(_start);
			}else{
				clearInterval(_t);
				alert('时间到！');
				window.location.href="{:U('Result/index',array('s_id'=>$s_id))}";
			}
		},1000);
	},
	run: function(){
		this.init();
		this.events();
	}
};
indexPage.run();
</script>
</body>
</html>